import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import NProgress from 'nprogress'

NProgress.configure({
  parent: '#app',
  showSpinner: false,
  easing: 'case',
  speed: 500,
})

import 'nprogress/nprogress.css'
// import { ElLoading } from 'element-plus'

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    component: () => import('../layout/layout.vue'),
    meta: {
      title: '首页',
    },
    children: [
      {
        path: '',
        component: () => import('../container/home.vue'),
      },
      {
        path: 'ManageArticles',
        component: () => import('../container/article.vue'),
        meta: {
          title: '文章管理',
        },
      },
      {
        path: 'ManageComments',
        component: () => import('../container/comment.vue'),
        meta: {
          title: '留言管理',
        },
      },
      {
        path: 'ManageUsers',
        component: () => import('../container/user.vue'),
        meta: {
          title: '用户管理',
        },
      },
      {
        path: 'ManageCategories',
        component: () => import('../container/category.vue'),
        meta: {
          title: '分类管理',
        },
      },
      {
        path: 'ManageTags',
        component: () => import('../container/tag.vue'),
        meta: {
          title: '标签管理',
        },
      },
      {
        path: 'WriteArticle',
        component: () => import('../container/addArt.vue'),
        meta: {
          title: '撰写文章',
        },
      },
      {
        path: 'WritePage',
        component: () => import('../container/addArt.vue'),
        meta: {
          title: '新建页面',
        },
      },
      {
        path: 'Role',
        component: () => import('../container/role.vue'),
        meta: {
          title: '管理员',
        },
      },
      {
        path: 'System',
        component: () => import('../container/System.vue'),
        meta: {
          title: '系统',
        },
      },
      {
        path: 'Access',
        component: () => import('../container/access.vue'),
        meta: {
          title: '访问记录',
        },
      },
      {
        path: 'Laboratory',
        component: () => import('../container/Laboratory.vue'),
        meta: {
          title: '实验室',
        },
      },
      {
        path: '404',
        component: () => import('../container/404.vue'),
        meta: {
          title: '404',
        },
      },
    ],
  },
  {
    path: '/login',
    meta: {
      title: '登录页',
    },
    component: () => import('../view/login.vue'),
  },
]

const VueRouter = createRouter({
  history: createWebHistory(),
  routes,
})

// let loadingInstance: any = null

//全局守卫
VueRouter.beforeEach((to, _from, next) => {
  // 进度条开始加载
  NProgress.start()
  // loadingInstance = ElLoading.service({ fullscreen: true })
  // token 验证 没有 token 不准许进一步操作
  // const token = storage.get('token')
  // if (lodash.isEmpty(token)) {
  //     next({ path: '/login' })
  // }
  if (to.matched.length !== 0) {
    next()
    document.title = to.meta.title as string
  } else {
    next({ path: '/main/404' })
  }
})

VueRouter.afterEach(() => {
  // 进度条加载完毕
  NProgress.done()
})

export default VueRouter
